<template>
	<view class="box_1">
		
			<view class="box_21">
				    <view class="box_24">便民服务</view>
					<view class="box_23">
						<image src="../../static/96.png" mode="" style="width: 50rpx; height: 50rpx;"></image>
					</view>
					<view class="box_22">
						<image src="../../static/95.png" mode="" style="width: 50rpx; height: 50rpx;"></image>
					</view>
			</view>
		
		<view class="box_2">
			<image src="../../static/74.png" mode="" class="img_1"></image>
		</view>
		<view class="box_3">
			<view class="box_4">
				<view class="">
					<image src="../../static/75.png" mode="" class="img_2"></image>
				</view>
				<view class="">
					郑州医惠保
				</view>
			</view>
			<view class="box_4">
				<view class="">
					<image src="../../static/76.png" mode="" class="img_2"></image>
				</view>
				<view class="">
					水电气暖
				</view>
			</view>
			<view class="box_4">
				<view class="">
					<image src="../../static/77.png" mode="" class="img_2"></image>
				</view>
				<view class="">
				    钱包缴费
				</view>
			</view>
			<view class="box_4">
				<view class="">
					<image src="../../static/78.png" mode="" class="img_2"></image>
				</view>
				<view class="">
					心通桥
				</view>
			</view>
		</view>
		<view class="box_6">
			<view class="" style="font-size: 40rpx; font-weight: 600;">
				附近<text style="color: blue;">0</text>停车场
			</view>
			<view class="box_7">
				<text>查看全部</text> <image src="../../static/69.png" mode="" style=" width: 50rpx; height: 40rpx;"></image>
			</view>
		</view>
		<view class="box_5">
			<view class="">
				当前区域暂无推荐停车场
			</view>
		</view>
		<view class="box_8">
			<view class="box_14">
				健康医疗
			</view>
			<view class="box_9">
				<image src="../../static/79.png" mode="" class="img_3"></image>
			</view>
			<view class="box_13">
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/80.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						智慧健康
					</view>
				</view>
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/81.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						看病就医
					</view>
				</view>
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/82.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						医保电子凭证
					</view>
				</view>
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/83.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						核算检测结果查询
					</view>
				</view>
			</view>
		</view>
		<view class="box_8">
			<view class="box_14">
				文化生活
			</view>
			<view class="box_9">
				<image src="../../static/84.png" mode="" class="img_3"></image>
			</view>
			<view class="box_13">
					<view class="uni-margin-wrap">
								<swiper class="swiper" indicator-active-color="#f5900a" :indicator-dots="true" :autoplay="autoplay" :interval="interval"
							:duration="duration">
									<swiper-item>
										<view class="swiper-item uni-bg-red">
											<view class="box_15">
												<view class="box_10">
													<view class="box_11">
														<image src="../../static/85.png" mode="" class="img_4"></image>
													</view>
													<view class="box_12">
														我要解纠纷
													</view>
												</view>
												<view class="box_10">
													<view class="box_11">
														<image src="../../static/86.png" mode="" class="img_4"></image>
													</view>
													<view class="box_12">
														有线电视一件事
													</view>
												</view>
												<view class="box_10">
													<view class="box_11">
														<image src="../../static/87.png" mode="" class="img_4"></image>
													</view>
													<view class="box_12">
														城管随手拍
													</view>
												</view>
												<view class="box_10">
													<view class="box_11">
														<image src="../../static/88.png" mode="" class="img_4"></image>
													</view>
													<view class="box_12">
													   水电气暖停供通知
													</view>
												</view>
											</view>
										</view>
									</swiper-item>
									<swiper-item>
										<view class="swiper-item uni-bg-green">
											<view class="box_16">
												<view class="box_10">
													<view class="box_11">
														<image src="../../static/94.png" mode="" class="img_4"></image>
													</view>
													<view class="box_12">
														谷子公益
													</view>
												</view>
											</view>
										</view>
									</swiper-item>
								</swiper>
							</view>
			</view>
		</view>
		<view class="box_8">
			<view class="box_14">
				交通出行
			</view>
			<view class="box_9">
				<image src="../../static/89.png" mode="" class="img_3"></image>
			</view>
			<view class="box_13">
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/90.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						绿城一卡通
					</view>
				</view>
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/91.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						东站换乘引导
					</view>
				</view>
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/92.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						地铁线路查询
					</view>
				</view>
				<view class="box_10">
					<view class="box_11">
						<image src="../../static/93.png" mode="" class="img_4"></image>
					</view>
					<view class="box_12">
						电子通行证一件事
					</view>
				</view>
			</view>
		</view>
		<view class="box_20">
			-我是有底线的-
		</view>
	</view>
</template>

<script>
</script>

<style scoped>
	.box_22{
		float: right;
		margin-top: 25rpx;
		margin-right: 20rpx;
	}
	.box_23{
		float: right;
		margin-right: 3%;
		margin-top: 25rpx;
	}
	.box_24{
		float: left;
		margin-left: 43%;
		line-height: 100rpx;
	}
	.box_21{
		width: 100%;
		height: 100rpx;
		background: #fff;
		color: #666;
		position: sticky;
		top: 0px;
		font-size: 32rpx;
		background-size: auto 50%;
		z-index: 100;
	}
	.box_20{
		margin-top: 30rpx;
		margin-bottom: 20rpx;
		color: #888888;
		font-size: 30rpx;
	}
.box_15{
		display: flex;
		flex-direction: row;
		justify-content: space-around;
	}
		.uni-margin-wrap {
			width: 690rpx;
			width: 100%;
		}
		.swiper {
			height: 200rpx;
		}
		.swiper-item {
			display: block;
			height: 200rpx;
			
			text-align: center;
		}
		.swiper-list {
			margin-top: 40rpx;
			margin-bottom: 0;
		}
		.uni-common-mt {
			margin-top: 60rpx;
			position: relative;
		}
		.info {
			position: absolute;
			right: 20rpx;
		}
		.uni-padding-wrap {
			width: 550rpx;
			padding: 0 100rpx;
		}

	.box_14{
		font-size: 40rpx;
		font-weight: 600;
		margin-top: 50rpx;
		margin-bottom: 30rpx;
	}
	.box_13{
		display: flex;
		flex-direction: row;
		justify-content: space-around;
	}
	.box_10{
		display: flex;
		flex-direction: column;
		text-align: center;
		width: 25%;
	}
	.img_4{
		width: 70rpx;
		height: 70rpx;
	}
	.img_3{
		width: 100%;
		height: 100%;
	}
	.box_9{
		width: 100%;
		height: 150rpx;
		margin-bottom: 30rpx;
	}
	.box_8{
		display: flex;
		flex-direction: column;
		
		width: 94%;
	}
	.box_7{
		display: flex;
		flex-direction: row;
		color: #888888;
	}
	.box_6{
		width: 94%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
	}
	.box_5{
		width: 94%;
		height: 240rpx;
		-moz-box-shadow:2px 2px 10px #ccc;
		-webkit-box-shadow:2px 2px 10px #ccc;
	    box-shadow:2px 2px 10px #ccc;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
	}
	.img_2{
		width: 100rpx;
		height: 100rpx;
	}
	.box_4{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		text-align: center;
		width: 25%;
	}
	.box_3{
		width: 94%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		margin-top: 50rpx;
		margin-bottom: 50rpx;
	}
	.box_1{
		width: 750rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.box_2{
		width: 94%;
		height: 240rpx;
	}
	.img_1{
		width: 100%;
		height: 100%;
	}
</style>